<template>
  <nav class="navbar navbar-light" style="background-color: #e3f2fd">
    <div class="container-fluid">
      <a class="navbar-brand">专业百科--词条审批</a>
      <button class="btn btn-primary" type="submit" @click="toLogout">
        登出
      </button>
    </div>
  </nav>

  <div class="card">
    <table class="table">
      <thead>
        <tr>
          <th scope="col">词条编号</th>
          <th scope="col">发起人</th>
          <th scope="col">名称</th>

          <!-- <th scope="col">内容</th> -->
          <th scope="col">审批操作</th>
        </tr>
      </thead>

      <tbody>
        <tr v-for="(entity, index) in entitys" :key="entity.requestId">
          <!-- 每一列参数需要修改为后端传递过来的参数 -->
          <th scope="row">{{ entity.requestId }}</th>
          <td>{{ entity.userId }}</td>
          <td>{{ entity.entityName }}</td>
          <!-- <td>实际内容</td> -->
          <td>
            <div class="d-grid d-md-block">
              <button
                @click="accept(entitys, index, entity)"
                class="btn btn-outline-primary btn-sm"
                type="button"
              >
                同意
              </button>
              <button
                @click="reject(entitys, index, entity)"
                class="btn btn-outline-primary btn-sm"
                type="button"
              >
                拒绝
              </button>
            </div>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script>
import $ from "jquery";
import { ref } from "vue";
import { useStore } from "vuex";

export default {
  name: "AdminPage",
  components: {},
  data() {
    return {
      file: "",
      name: "",
      user_id: "",
      admin_id: 1,
    };
  },
  methods: {
    toLogout() {
      this.$router.push("/main");
    },
    reject (entitys, index, entity){
      console.log("reject");
      this.axios.post("entity/not_pass", {
        requestId: entity.requestId,
        userId: entity.userId,
        entityName: entity.entityName,
      }).then(res=>{
        entitys.splice(index, 1);
      })
    },
    accept (entitys, index, entity) {
      console.log("accecpt");
      let str = sessionStorage.getItem("admin")
      let admin_temp = JSON.parse(str)
      this.axios.post("entity/new", {
        file: "# " + entity.entityName,
        name: entity.entityName,
        userId: entity.userId,
        adminId: admin_temp.id,
        requestId: entity.requestId,
      });
      entitys.splice(index, 1);
    },
  },
  setup() {
    const store = useStore();
    let entitys = ref([]);

    $.ajax({
      url: "http://localhost:9090/entity_request/gets",
      // 作为示例的后端参数，应修改为实际url
      type: "get",
      success(resp) {
        console.log(resp);
        entitys.value = resp.data;
        console.log(entitys);
      },
    });
    return {
      entitys,
    };
  },
};
</script>

<style scoped>
.card {
  margin-top: 20px;
}

.button {
  margin-right: 20px;
}
</style>
